<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>客户页面4</title>
		<link rel="stylesheet" href="../js/plugins/layui-v2.4.5/layui/css/layui.css" />
		<link rel="stylesheet" href="../css/reset.css" />
		<link rel="stylesheet" href="../css/center4.css" />
	</head>
	<body>
		<div class="container">
			<!--上半部分-->
			<div class="layui-row top layui-col-space10">
				<div class="layui-col-sm3 ">
					<div class="layui-card">
						<div class="layui-card-header">
							重点工作<span class="layui-badge" style="margin-left: 5px;">6</span>
						</div>
						<div class="layui-card-body">
							<header class="list-header">
								<span class="title">工作内容</span>
								<span class="time">通知时间</span>
							</header>
							<div class="content-scroll">
								<ul class="list-content red">
									<li><span class="title">11层领导电脑报修</span><span class="time">2019.5.6 10:21</span></li>
									<li><span class="title">节点机房抢修</span><span class="time">2019.5.6 10:11</span></li>
									<li><span class="title">21层领导网络故障</span><span class="time">2019.5.6 9:14</span></li>
									<li><span class="title">11层领导电脑报修</span><span class="time">2019.5.6 8:41</span></li>
								</ul>
							</div>
						</div>
					</div>
				</div>
				<div class="layui-col-sm6 ">
					<div class="layui-card">
						<div class="layui-card-header">环动图</div>
						<div class="layui-card-body">
							<!-- <img src="../img/map_img.jpg" class="map_img"/> -->
							<div id="allmap"></div>
						</div>
					</div>
				</div>
				<div class="layui-col-sm3 ">
					<div class="layui-card" style="height: calc(75% - 15px);">
						<div class="layui-card-header">我的日程</div>
						<div class="layui-card-body layui-row layui-col-space10" style="overflow: auto;">
							<div class="layui-col-xs6">
								<a href="javascript:;" class="backlog-body">
									<h3>机房</h3>
									<p><cite>3</cite>个</p>
								</a>
							</div>
							<div class="layui-col-xs6">
								<a href="javascript:;" class="backlog-body">
									<h3>服务器</h3>
									<p><cite>31</cite>台</p>
								</a>
							</div>
							<div class="layui-col-xs6">
								<a href="javascript:;" class="backlog-body">
									<h3>网络设备</h3>
									<p><cite>38</cite>台</p>
								</a>
							</div>
							<div class="layui-col-xs6">
								<a href="javascript:;" class="backlog-body">
									<h3>监控设备</h3>
									<p><cite>538</cite>台</p>
								</a>
							</div>
						</div>
					</div>
					<div class="layui-row layui-col-space10 login-container" >
						<div class="layui-col-xs6" >
							<a href="javascript:;" class="backlog-body" >
								<h3><i class="layui-icon layui-icon-website" ></i>OA登录</h3>
							</a>
						</div>
						<div class="layui-col-xs6">
							<a href="javascript:;" class="backlog-body">
								<h3><i class="layui-icon layui-icon-component"></i>监控登录</h3>
							</a>
						</div>
					</div>
					
				</div>
			</div>
			<!--下半部分-->
			<div class="layui-row bottom layui-col-space10">
				<div class="layui-col-sm3">
					<div class="layui-card">
						<div class="layui-card-header">故障报修</div>
						<div class="layui-card-body">
							<div id="orderEchart" style="width: 100%;height: 100%;"></div>
						</div>
					</div>
				</div>
				<div class="layui-col-sm6 ">
					<div class="layui-card">
						<div class="layui-card-header">监控报警</div>
						<div class="layui-card-body">
							<header class="list-header">
								<span class="title">事项</span>
								<span>报警级别</span>
								<span class="time">报警时间</span>
							</header>
							<div class="content-scroll">
								<ul class="list-content">
									<li><span class="title">荣华东路3号监控不亮</span>
										<span class="red"><i class="layui-icon layui-icon-rate-solid"></i><i class="layui-icon layui-icon-rate-solid"></i><i class="layui-icon layui-icon-rate-solid"></i></span>
										<span class="time">2019.5.6 10:21</span>
									</li>
									<li><span class="title">企业大道5号监控不亮</span>
										<span class="red"><i class="layui-icon layui-icon-rate-solid"></i><i class="layui-icon layui-icon-rate-solid"></i><i class="layui-icon layui-icon-rate-solid"></i></span>
										<span class="time">2019.5.6 10:11</span>
									</li>
									<li><span class="title">总部10层监控区域有人经过</span>
										<span class="red"><i class="layui-icon layui-icon-rate-solid"></i><i class="layui-icon layui-icon-rate-solid"></i><i class="layui-icon layui-icon-rate-solid"></i></span>
										<span class="time">2019.5.6 9:14</span>
									</li>
									<li><span class="title">交通队入口监控不亮</span>
										<span class="red"><i class="layui-icon layui-icon-rate-solid"></i><i class="layui-icon layui-icon-rate-solid"></i><i class="layui-icon layui-icon-rate-solid"></i></span>
										<span class="time">2019.5.6 8:14</span>
									</li>
								</ul>
							</div>
						</div>
					</div>
				</div>
				<div class="layui-col-sm3 ">
					<div class="layui-card">
						<div class="layui-card-header layui-tab layui-tab-brief" lay-filter="msgTab">
							 <ul class="layui-tab-title">
								<li class="layui-this">通知<span class="layui-badge">6</span></li>
								<li>公告<span class="layui-badge">6</span></li>
								<li>知识库<span class="layui-badge">6</span></li>
							  </ul>
						</div>
						<div class="layui-card-body layui-tab-content">
							<div class="layui-tab-item layui-show">
								<header class="list-header">
									<span class="title">内容</span>
									<span class="time">通知时间</span>
								</header>
								<div class="content-scroll">
									<ul class="list-content">
										<li><span class="title">11层领导电脑维修完毕</span><span class="time">2019.5.6 10:21</span></li>
										<li><span class="title">节点机房开始抢修</span><span class="time">2019.5.6 10:11</span></li>
									</ul>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<script src="../js/jquery-3.3.1.min.js"></script>
		<script src="../js/plugins/layui-v2.4.5/layui/layui.js"></script>
		<!--故障报修饼图-->
		<script src="../js/plugins/echarts.js"></script>
		<script src="../js/pieChart2.js"></script>
		<!--地图-->
		<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=c6z10TxX9lNzVzPXz8BqTXPUmgES16KI"></script>
		<script src="../js/map.js"></script>
		<script>
			$(function(){
			})
		</script>
	</body>
</html>
